<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%=basePath%>">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>导出</title>

<link rel="stylesheet" type="text/css" media="screen" href="jquery-ui-1.7.2.custom/css/redmond/jquery-ui-1.7.2.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="jqgrid/css/ui.jqgrid.css" />
<script src="jqgrid/js/jquery-1.9.0.min.js" type="text/javascript"></script>
<script src="jqgrid/js/i18n/grid.locale-cn.js" type="text/javascript"></script>
<script src="jqgrid/js/jquery.jqGrid.min.js" type="text/javascript"></script>

<script type="text/javascript">
$(function(){
  $("#list").jqGrid({
    url:'studentController/findParasByPageToJSON.action',	//返回数据的地址
    datatype: 'json',	//返回数据的类型
    mtype: 'post',	//请求的方式
    colNames:['编号','姓名', '年龄','生日'],	//列表
    colModel :[ 	//数据模型
      {name:'id', index:'id', width:155,jsonmap:'id',editable:false, editoptions:{readonly:true}, sorttype:'int'}, 
      {name:'name', index:'name',jsonmap:'name', width:190,editable:true}, 
      {name:'age', index:'age',width:180,jsonmap:'age', align:'right',editable:true}, 
      {name:'birthday', index:'birthday',jsonmap:'birthday', sorttype:'date', editable:true, editrules:{date:true},formatter:'date', formatoptions:{newformat: 'Y-m-d'}}
    ],
    pager: '#pager',	//指定分页栏 的渲染 的ID
    rowNum:10,	//在grid上显示记录条数,每页显示多少条
    rowList:[10,20,30],	//一个数组用来调整表格显示的记录数，此参数值会替代rowNum参数值传给服务器端。如果为空则不显示，设置格式：[10,20,30]
    sortname: 'invid',	//排序列的名称，此参数会被传到后台
    sortorder: 'desc',	//排序顺序，升序或者降序（asc or desc）
    viewrecords: true,	//是否要显示总记录数
    gridview: true,	//构造一行数据后添加到grid中，如果设为true则是将整个表格的数据都构造完成后再添加到grid中
    caption: 'My first grid',	//定义表格名称
    editurl:'studentController/dataOper.action'
  }); 
  
  jQuery('#list').jqGrid('navGrid','#pager',
		  {"edit":true,"add":true,"del":true,"search":true,"refresh":true,"view":false,"excel":true,"pdf":true,"csv":false,"columns":false},
		  {"drag":true,"resize":true,closeAfterAdd:false,"closeOnEscape":true,"dataheight":150,"errorTextFormat":function(r){ return r.responseText;}},
		  {"drag":true,"resize":true,"closeOnEscape":true,"dataheight":150,"errorTextFormat":function(r){ return r.responseText;}},{"errorTextFormat":function(r){ return r.responseText;}},
		  {"drag":true,"closeAfterSearch":true,"multipleSearch":true},
		  {"drag":true,"resize":true,"closeOnEscape":true,"dataheight":150} );
  
	 
  //添加excel导出
  jQuery('#list').jqGrid('navButtonAdd','#pager',{id:'pager_excel', caption:'',title:'excel导出',onClickButton : function(e){
		try {
			window.open("studentController/excelExport.action");
			
		} catch (e) {
			window.location= 'grid.php?oper=excel';
		}
	},buttonicon:'ui-icon-newwin'}); 
	
  //添加pdf导出
  jQuery('#list').jqGrid('navButtonAdd','#pager',
		{id:'pager_pdf',caption:'',title:'pdf导出',onClickButton : function(e){
		try {
			window.location= 'studentController/pdfExport.action';
		} catch (e) {
			window.location= 'grid.php?oper=pdf';
		}
  }, buttonicon:'ui-icon-print'}); 
	
});
</script>

</head>
<body>
<table id="list"><tr><td/></tr></table> 
<div id="pager"></div> 
</body>
</html>